<template>
  <div>
    <div class="top">
      <van-nav-bar
        title="新增地址"
        left-text=""
        left-arrow
        @click-left="onClickLeft"
      />
    </div>
    <div class="main">
      <van-address-edit
        :area-list="areaList"
        :columns-num="2"
        show-postal
        show-set-default
        show-search-result
        :columns-placeholder="['请选择', '请选择', '请选择']"
        @save="onSave"
      />
    </div>
  </div>
</template>
<script>
import Vue from "vue";
import { Area } from "vant";
Vue.use(Area);
import { postAddress } from "../../request/api";
import { areaList } from "@vant/area-data";
export default {
  data() {
    return {
      areaList,
    };
  },
  methods: {
    onClickLeft() {
      this.$router.go(-1);
    },
    onSave(val) {
      console.log(val);
      postAddress({
        userid: localStorage.getItem("userid"),
        token: localStorage.getItem("token"),
        name: val.name,
        tel: val.tel,
        province: val.province,
        city: val.city,
        county: val.county,
        addressDetail: val.addressDetail,
        isDefault: val.isDefault,
      }).then((res) => {
        console.log(res.data);
        this.$router.go(-1)
      });

    },

  },
};
</script>

<style>
</style>